I'm building something in a lo-code / spaghetti solution environment, combining Airtable as a database, Typeform, and a front-end platform called Softr. (Not my idea, but it is my headache.)

I have a section on a page called #button-list which searches a cell an Airtable table. If the cell is empty, it returns a button to a Typeform. If the cell is filled, it returns the results from the Typeform form.

When the button is clicked, it opens up a modal with a Typeform on the side of the page.

The relevant section of the button code is:

<button data-tf-slider="yyyyy" data-tf-on-close="function(){document.getElementById("button-list").reload();}" data-tf-auto-close data-tf-iframe-props="title=Typeform" data-tf-hidden="uid=xxxxx," ">Start</button><script src="//embed.typeform.com/next/embed.js"></script>

(yyyyy and xxxxx are substituted for the relevant user's information.)

On close of the the Typeform, I'd like the section to refresh, so you see the results instead of the button. So I'm trying to use the data-tf-on-close callback in order to refresh the section.

I'm not sure if I'm going down the right path or not. Should it be parent.document.getElementById("button-list").reload(); because the modal is closing, so it's technically not the document? Should I be setting up some sort of emitter, so I can set up an event listener on the page to reload the section? Do I simply have the syntax wrong? Am I missing something simple? Is this not possible?

Thank you.